<template>
  <a @click="dialog = true">
    <span>查看</span>
    <a-modal v-model="dialog" title="违约明细" @ok="submit" class="text-xl" :footer="null">
      <p class="text-lg my-10">违约类型：{{ getType(record.detail) }}</p>
      <p class="text-lg my-10">开始日期：{{ humanizeDate(record.startdata) }}</p>
      <p class="text-lg my-10">完成日期：{{ humanizeDate(record.enddata) }}</p>
      <p class="text-lg my-10">利息：{{ minMoney(record.interests) }}</p>
    </a-modal>
  </a>
</template>
<script>
import { calcTypes } from '@/dict'
import moment from 'moment'
export default {
  name: 'executeDetail',
  props: ['record'],
  data() {
    return {
      dialog: false,
      detail: '',
      startdata: '',
      enddata: '',
      interests: '',
      pagination: {
        total: 1,
        pageSize: 10,
        onChange: this.getData
      }
    }
  },
  // mounted() {
  //   this.getData()
  // },
  methods: {
    humanizeDate(v) {
      if (v) {
        return moment(v * 1000).format('YYYY-MM-DD') || '--'
      } else {
        return '-'
      }
    },
    moneyType(v) {
      return `${v}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')
    },
    minMoney(v) {
      if (v) {
        v = Number(v).toFixed(2)
        return `${v}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')
      } else {
        return ''
      }
    },
    getType(detail) {
      return calcTypes.find(el => el.value == detail)?.text
    },
    submit() {
      this.dialog = false
    }
  }
}
</script>
<style lang="scss" scoped></style>
